import { Col, message, Row, Spin } from 'antd';
import { connect } from 'umi';
import { VersionManageAPI } from '../common/type';
import { DetailLeftView } from './DetailLeftView';
import { DetailRightView } from './DetailRightView';
import '../common/styles.less';
import { useEffect } from 'react';
import { getVersionDetailService } from '../services';
import { VersionDetailContext } from '../common/UpdateContext';
const DetailView: React.FC<VersionManageAPI.IVersionDetailView> = ({
  curRes,
  locationProps,
}) => {
  const prefixCls = 'version-update-';
  /**
   * 获取数据详情
   * @param res
   */
  const getVersionDetailCallBack = (res: any) => {
    if (res && res?.msgFlag) {
      // message.success(res?.msg);
    } else {
      message.error(res?.msg);
    }
  };

  const {
    getVersionDetailRun,
    getVersionDetailLoading,
    getVersionDetailData,
  } = getVersionDetailService(getVersionDetailCallBack);

  /**初始化请求系统版本详情 */
  useEffect(() => {
    if (locationProps?.state?.id) {
      reloadVersionInfo();
    }
  }, [locationProps?.state]);

  /**
   * 刷新详情
   */
  const reloadVersionInfo = () => {
    getVersionDetailRun(locationProps?.state);
  };
  return (
    <>
      <VersionDetailContext.Provider
        value={{
          prefixCls,
          curRes,
          locationProps,
          reloadVersionInfo,
          getVersionDetailLoading,
          getVersionDetailData,
        }}
      >
        <Spin spinning={getVersionDetailLoading}>
          <Row className={prefixCls + 'row'} gutter={[8, 0]}>
            <Col
              span={16}
              className={prefixCls + 'row-col'}
              style={{ paddingLeft: '0px' }}
            >
              <DetailLeftView />
            </Col>
            <Col
              span={8}
              className={prefixCls + 'row-col'}
              style={{ paddingRight: '0px' }}
            >
              <DetailRightView />
            </Col>
          </Row>
        </Spin>
      </VersionDetailContext.Provider>
    </>
  );
};

export default connect(({ baseLogin, navTab }: Record<string, any>) => ({
  curRes: baseLogin?.permissions,
  navTab,
}))(DetailView);
